import React from 'react'
import { Table } from 'antd';
export default function TableCom() {
  //1. 准备数据
  const dataSource = [
    {
      id: 1,
      name: '胡彦斌',
      age: 32,
      address: '西湖区湖底公园1号',
    },
    {
      id: 2,
      name: '吴彦祖',
      age: 42,
      address: '西湖区湖底公园1号',
    },
  ];
  
  //2. 声明表格的结构
  const columns = [
    {
      title: '编号',  // 标头
      dataIndex: 'id', // 对应数据中的属性
    },
    //列信息配置
    {
      title: '姓名',  // 标头
      dataIndex: 'name', // 对应数据中的属性
    },
    {
      title: '年龄',
      dataIndex: 'age',
    },
    {
      title: '住址',
      dataIndex: 'address',
    },
  ];
  
  return (
    // 3. 渲染 Table 组件
    <Table 
      columns={columns} 
      dataSource={dataSource}
      bordered
      rowKey={'id'} 
      />
  )
}
